<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<script type="text/javascript">
	var columns;
	var props;
	$(function() {
		initColumns();
		initProps();
		
		$(".ruleContent").datagrid({
			onLoadSuccess: function(data){
				//$(this).parents(".table_content").find("span.spinner").children("input").val(data.ruleIndex);
				var rule = $(this).parents(".table_content").find("span.spinner").children("input");
				
				if(rule.val() != data.ruleIndex) {
					if (data.ruleIndex == 0) {
						$(rule).val(1);
					} else {
						$(rule).val(data.ruleIndex);
					}
				}
				
				if(data.ruleType == 0){
					$(this).parents(".addContent").hide();
					$(this).parents(".table_content").children(".queryContent").show();
					$(this).parents(".table_content").find("input[type=radio][value=1]").attr("checked",'checked');
					$(this).parents(".table_content").find(".op_type").find("option[value='0']").attr("selected",true);
					$(this).parents(".table_content").find(".op_type").attr("disabled","disabled");
					
					$.each($(".queryContent tbody tr"), function(i , n) {
						$(this).remove();
					});
					
					var html = "<tr><td>返回值：";
					html += "<select>";
					$.each(props , function(i , n) {
						if(n.property_id == data.returnProp){
							html += "<option value='" + n.property_id + "' selected='selected'>" + n.property_name + "</option>";
						}else{
							html += "<option value='" + n.property_id + "'>" + n.property_name + "</option>";
						}
					});
					
					html += "</select></td>";
					html += "</tr>";
					$(".queryContent tbody").append(html);
					
					$.each(data.rows , function(i , n) {
						var htm = "<tr onmouseover='$(this).find(\"a\").show()' onmouseout='$(this).find(\"a\").hide()'><td><select class='property'>";
						htm += "<option value='-1'>请选择字段</option>";
						$.each(props , function(j , p) {
							if ( n.pid == p.property_id) {
								htm += "<option selected='selected' value='" + p.property_id + "'>" + p.property_name + "</option>";
							} else {
								htm += "<option value='" + p.property_id + "'>" + p.property_name + "</option>";
							}
						});
						
						htm += "</select>&nbsp;<select class='eq'><option value='='>=</option></select>&nbsp;";
					
						var columnSelect = "<select class='column' onchange='columnChange(this)'>";
						columnSelect += "<option value='-1'>请选择对应列</option>";
						
						$.each(columns , function(k , c) {
							if (n.cid == c.column_id) {
								columnSelect += "<option selected='selected' value='" + c.column_id + "'>" + c.column_name + "</option>";
							} else {
								columnSelect += "<option value='" + c.column_id + "'>" + c.column_name + "</option>";
							}
						});
						
						columnSelect += "<option value='-99'>自定义值</option>";
						columnSelect += "</select>"; 
						htm += columnSelect; 
						
						htm += "&nbsp;&nbsp;<a style='display : none;' href='javascript:void(0);' onclick='$(this).parents(\"tr\").remove()' class='easyui-linkbutton' iconCls='icon-add' plain='true'>删除</a>";
						htm += "</td>";
						htm += "</tr>";
						$(".queryContent tbody").append(htm);
					});
					
				
				}
				
			}
		});
		
	});
	
	function initColumns() {
		if (columns != null && columns.length > 0) {
			return;
		}
		$.ajax({
			typpe : "post",
			url : '<c:url value="/etl/mapping_column.tg"/>',
			dataType : 'json',
			data : {"shopId" : "${shopId}"},
			async : false,
			success : function(result) {
				columns = eval(result);
			}
		});
	}
	
	function initProps() {
		if (props != null && props.length > 0) {
			return;
		}
		$.ajax({
			typpe : "post",
			url : '<c:url value="etl/mapping_property.tg?tableId=${tableId}"/>',
			dataType : 'json',
			data : {"shopId" : "${shopId}"},
			async : false,
			success : function(result) {
				props = eval(result);
			}
		});
	}
	
	function repeatFormatter(value) {
		if (value) {
			return "<select class='repeat'><option selected='selected' value='1'>是</option><option value='0'>否</option></select>";
		} else {
			return "<select class='repeat'><option value='1'>是</option><option selected='selected' value='0'>否</option></select>";
		}
	}
	
	function foreignKeyFormatter(value,row,index) {
		if (value) {
			var pc_index = row["index"];
			return "<select class='foreignKey' onchange='changeForignKey(this)'><option selected='selected' value='1'>是</option><option value='0'>否</option></select>&nbsp;<input value='" + pc_index + "' style='width:50px;'>";
		} else {
			return "<select class='foreignKey' onchange='changeForignKey(this)'><option value='1'>是</option><option selected='selected' value='0'>否</option></select>";
		}
	}
	
	function defaultValueFormatter(value,row,index){
		return "<input name=\"defaultValue\" class=\"easyui-validatebox validatebox-text\" style=\"width:150px\" value='"+ value+ "'></input>";
	}
	
	function primaryKeyFormatter(value,row,index) {
		if (value) {
			var primary = row["primary"];
			var html = "<select class='isPrimarykey' onchange='changePrimaryKey(this)'><option selected='selected' value='1'>是</option><option value='0'>否</option></select>";
			if (primary) {
				html += "&nbsp;<select class='primarykey'><option value='1'>策略生成</option><option value='0'>自动递增</option></select>";
			} else {
				html += "&nbsp;<select class='primarykey'><option value='0'>自动递增</option><option value='1'>策略生成</option></select>";
			}
			return html;
		} else {
			return "<select class='isPrimarykey' onchange='changePrimaryKey(this)'><option value='1'>是</option><option selected='selected' value='0'>否</option></select>";
		}
	}
	
	
	function changePrimaryKey(obj) {
		var tr = $(obj).parents("tr");
		if ($(obj).val() == "1") {
			$(tr).children("td").eq(2).find("div").append("&nbsp;<select class='primarykey'><option value='0'>自动递增</option><option value='1'>策略生成</option></select>");
		} else {
			$(tr).children("td").eq(2).find(".primarykey").remove();
		}
	}
	
	
	function changeForignKey(obj) {
		var tr = $(obj).parents("tr");
		if ($(obj).val() == "1") {
			$(tr).children("td").eq(3).find("div").append("&nbsp;<input value='1' style='width:50px;'>");
		} else {
			$(tr).children("td").eq(3).find("input").remove();
		}
	}
	
	
	
	function columnFormatter(value,row,index) {
		var html = "<select class='column' onchange='columnChange(this)'>";
		html += "<option value='-1'>请选择对应列</option>";
		$.each(columns , function(i , n) {
			if (value == n.column_id) {
				html += "<option selected='selected' value='" + n.column_id + "'>" + n.column_name + "</option>";
			} else {
				html += "<option value='" + n.column_id + "'>" + n.column_name + "</option>";
			}
		});
		if ((value == null || value == "") && row.otherValue != null && "" != row.otherValue) {
			html += "<option selected='selected' value='-99'>自定义值</option>";
		} else {
			html += "<option value='-99'>自定义值</option>";
		}
		html += "</select>";
		if(row.otherValue != null && "" != row.otherValue) {
			html += "&nbsp;<input type='text' class='otherValue' value='"+row.otherValue+"'>";
		}
		return html;
	}
	
	
	function columnChange(obj) {
		if ($(obj).val() == "-99") {
			$(obj).parent().append("&nbsp;<input type='text' class='otherValue'>");
		} else {
			$(obj).parent().find(".otherValue").remove();
		}
	}

	function op_select(obj) {
		var contentDiv = $(obj).parents(".table_content");
		switch($(obj).val()) {
		case "0":
			$(contentDiv).children(".addContent").hide();
			$(contentDiv).children(".queryContent").show();
			
			$.each($(".queryContent tbody tr"), function(i , n) {
				$(this).remove();
			});
			
			var html = "<tr><td>返回值：";
			html += "<select>";
			$.each(props , function(i , n) {
				html += "<option value='" + n.property_id + "'>" + n.property_name + "</option>";
			});
			html += "</select></td>";
			html += "</tr>";
			$(".queryContent tbody").append(html);
			break;
		case "1":
			$(contentDiv).children(".addContent").show();
			$(contentDiv).children(".queryContent").hide();
			break;
		}
	}
	
	
	function addCondition() {
		var html = "<tr onmouseover='$(this).find(\"a\").show()' onmouseout='$(this).find(\"a\").hide()'><td><select class='property'>";
		html += "<option value='-1'>请选择字段</option>";
		$.each(props , function(i , n) {
			if (value == n.property_id) {
				html += "<option selected='selected' value='" + n.property_id + "'>" + n.property_name + "</option>";
			} else {
				html += "<option value='" + n.property_id + "'>" + n.property_name + "</option>";
			}
		});
		html += "</select>&nbsp;<select class='eq'><option value='='>=</option></select>&nbsp;";
		var columnSelect = columnFormatter(1,1,1);
		html += columnSelect;
		
		html += "&nbsp;&nbsp;<a style='display : none;' href='javascript:void(0);' onclick='$(this).parents(\"tr\").remove()' class='easyui-linkbutton' iconCls='icon-add' plain='true'>删除</a>";
		html += "</td>";
		html += "</tr>";
		$(".queryContent tbody").append(html);
	}
	
	function saveContent(obj){
		var target;
		var op_type = $(obj).parents(".table_content").find(".op_type").val();
		
		if(op_type == "1"){
			target = $(obj).parents(".table_content").find(".saveContent");
		}else{
			target = $(obj).parents(".table_content").find(".saveContent1");
		}	
		save(target);
	}
	
	function save(obj) {
		var ruleindex = $(obj).parents(".table_content").find(".ruleindex").val();
		var ruleIndexEqual = false;
		$(obj).parents(".panel").siblings("div").each(function(){
			 if(ruleindex == $(this).find("span.spinner").children("input").val()){
				 ruleIndexEqual = true;
			 }
		 });
		
		if(ruleIndexEqual){
			 alert("不能含有相同的执行顺序,请检测后再保存!");
			 return;
		}
		
		var op_type = $(obj).parents(".table_content").find(".op_type").val();
		var data = new Array();
		if (op_type == "1") { // 添加
			var tr = $(obj).parents(".addContent").find(".datagrid-body").find("tr");
			$(tr).each(function(i , n) {
				var row = {};
				row.pid = $(this).children("td").eq(0).find("div").text();
				row.isPrimarykey = $(this).children("td").eq(2).find(".isPrimarykey").val();
				row.primarykey = $(this).children("td").eq(2).find(".primarykey").val();
				row.isForeignkey = $(this).children("td").eq(3).find("select").val();
				row.foreignkey = $(this).children("td").eq(3).find("input").val();
				row.isRepeat = $(this).children("td").eq(4).find("select").val();
				row.cid = $(this).children("td").eq(5).find("select").val();
				row.otherValue = $(this).children("td").eq(5).find(".otherValue").val();
				row.ruleindex = ruleindex;
				row.ruletype = op_type;
				row.shopid = shopId;
				data.push(row);
			});
		} else { // 查询
			var tr = $(obj).parents(".queryContent").children("table").children("tbody").find("tr");
			var rulereturn;
			$(tr).each(function(i , n) {
				var row = {};
				if (i == 0) {
					rulereturn = $(this).children("td").find("select").val();
					return true;
				}
				row.pid = $(this).children("td").find(".property").val();
				row.cid = $(this).children("td").find(".column").val();
				row.otherValue = $(this).children("td").find(".otherValue").val();
				row.eq = $(this).children("td").find(".eq").val();
				row.ruleindex = ruleindex;
				row.ruletype = op_type;
				row.shopid = shopId;
				row.rulereturn = rulereturn;
				data.push(row);
			});
		}
		
		$.ajax({
			type : "post",
			url : '<c:url value="/etl/mapping_save.tg"/>',
			dataType : 'json',
			beforeSend:ajaxLoading,
			data : {mapped: $.toJSON(data)},
			success : function(result) {
				ajaxLoadEnd();
				var data = eval(result);
				var panel = $('#tables').accordion('getSelected');
				$(panel).find(".table_content").append("<input type='hidden' class='rule_id' value='" + data.rule_id + "' />");
				alert(data.message);
				location.replace(location.href);
			} , 
			error : function() {
				ajaxLoadEnd();
			}
		});
	}
	
</script>
<div class="table_content">
	<div style="margin-bottom: 5px;">
		操作类型：
		<select class="op_type" onchange="op_select(this)">
			<option value="1">新增</option>
			<option value="0">查询</option>
		</select>
		执行顺序：<input class="easyui-numberspinner ruleindex" value="1" style="width:50px;">
		&nbsp;&nbsp;&nbsp;
		<a href="javascript:void(0);"  class="addCondition" onclick="addCondition()" class="easyui-linkbutton" iconCls="icon-add" plain="true">增加条件</a>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<a href="javascript:void(0);" onclick="saveContent(this)" class="easyui-linkbutton" iconCls="icon-add" plain="true">保存</a>
		<a href="javascript:void(0);" onclick="reloadItem()" class="easyui-linkbutton" iconCls="icon-add" plain="true">移除</a>
	</div>
	<div class="addContent" style="overflow: scroll; height: 300px;">
		<table class="easyui-datagrid ruleContent" fitColumns="true" url="<c:url value='/etl/mapping_propertyRules.tg?tableId=${tableId}&shopId=${shopId}&ruleId=${ruleId}'/>">
			<thead>
				<th field="pid" width="30" >字段编号</th>
				<th field="pname" width="150" >字段</th>
				<th field="isPrimaryKey" width="100"  formatter="primaryKeyFormatter">是否主键</th>
				<th field="isForeignKey" width="100"  formatter="foreignKeyFormatter">是否外键</th>
				<th field="isRepeat" width="100" formatter="repeatFormatter">重复依据</th>
				<th field="cid" width="200"  formatter="columnFormatter">Excel列</th>
			</thead>
		</table>
		<a href="javascript:void(0);" onclick="save(this)" class="easyui-linkbutton saveContent" iconCls="icon-add" plain="true">保存</a>
	</div>
	<div class="queryContent" style="display: none;">
		<table>
			<tbody>
			</tbody>
		</table>
		<a href="javascript:void(0);" onclick="save(this)" class="easyui-linkbutton saveContent1 " iconCls="icon-add" plain="true">保存</a>
	</div>
</div>